<template>
  <div>
    <t-navbar :fixed="true"  title="我的"/>

<!--    用户信息-->
    <div style="padding-top: 40px;padding-bottom: 40px;background-color: lavender">
      <t-row>
            <t-col span="4" style="text-align: right"><t-avatar class="avatar-example" image="https://tdesign.gtimg.com/mobile/demos/avatar1.png"></t-avatar></t-col>
            <t-col span="10" style="text-align: left;margin-left: 10px">
              <div>{{user.nickName}}</div>
              <div style="font-size: 10px;margin-top: 5px">剩余测试次数：<span style="color: red;font-size: 15px"> {{user.num}} </span> 次</div>
            </t-col>
            <t-col span="6" @click="tz('/userinfo')"> <icon name="setting-1" color="#0052D9" /><span style="font-size: 12px;margin-left: 5px">修改密码</span></t-col>
      </t-row>
    </div>
<!--    导航-->
    <div>
      <t-cell title="操作痕迹" @click="tz('/log')" arrow hover />
      <t-cell title="我的测试" @click="tz('/exam')" arrow hover />
      <t-cell title="我的试题" @click="tz('/question')" arrow hover />
      <t-cell title="意见反馈"  arrow hover />
      <t-cell title="关于我们" arrow hover />
    </div>
    <div style="margin-top: 10px">
      <t-button theme="primary" @click="tz('/')" block>退出账号</t-button>
    </div>
  </div>
</template>

<script setup>
import {ref,onMounted} from "vue";
import { Icon } from 'tdesign-icons-vue-next';
import {useRouter} from "vue-router";

const user=ref({})
const router=useRouter()

onMounted(()=>{
  let json=localStorage.getItem("user");
  user.value=JSON.parse(json)

})
const tz=(url)=>{
  router.push(url)
}
</script>

<style scoped>

</style>